<!DOCTYPE html>
<html>
<head>
<script src="../../../resources/js-test.js"></script>
<script src="../resources/common.js"></script>
<script src="../resources/picker-common.js"></script>
</head>
<body>
<select id="menu">
  <option>foo</option>
  <option selected>bar</option>
  <option hidden>baz</option>
  <optgroup label="qux">
      <option>garply</option>
  </optgroup>
</select>
<script>

var events = [];
function recordEvent(event) {
    events.push(event.type);
}

var menu = document.getElementById('menu');
var picker = null;
function openPickerErrorCallback() {
    testFailed('picker didn\'t open')
    finishJSTest();
}
openPicker(menu, test1, openPickerErrorCallback);

function test1() {
    picker = internals.pagePopupWindow.global.picker;
    menu.addEventListener('mouseup', recordEvent);
    menu.addEventListener('click', recordEvent);
    menu.addEventListener('change', recordEvent);
    eventSender.keyDown('ArrowDown');
    eventSender.keyDown('Enter');
    shouldBeNull('internals.pagePopupWindow');
    shouldBeEqualToString('menu.value', 'garply');
    shouldBeEqualToString('internals.selectMenuListText(menu)', 'garply');
    shouldBeEqualToString('events[0]', 'change');
    shouldBeEqualToString('events[1]', 'mouseup');
    shouldBeEqualToString('events[2]', 'click');

    finishJSTest();
}
</script>
</body>
</html>
